<template>
  <div>
    <van-nav-bar
      style="background-color: Gainsboro;"
      title="我的收藏"
      left-arrow
      @click-left="onClickLeft"
    />
    <div class="main" v-for="item in history"  :key="item.id">
      <van-image
        width="10rem"
        height="7rem"
        fit="cover"
        position="left"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"/>
      <div class="right">
        <div class="top">
          <p class="title">{{ item.movieid }}</p>
          <van-tag plain type="primary"><van-icon name="cross" /></van-tag>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import httpApi from '@/http';
import { Toast } from 'vant';

export default {
  data() {
    return {
      history: {}
    }
  },
  methods: {
    onClickLeft() {
      this.$router.push('/home/my')
    },

    gethistort(){
      httpApi.userApi.queryCollecting().then(res=>{
        this.history = res.data.data
        console.log('我的收藏',this.history)
      })
    }
  },

  mounted () {
    this.gethistort()
  },
}
</script>

<style lang="scss" scoped>
.main{
  display: flex;
  padding: 15px;
  border-bottom: 1px solid #9a9a9a;
}
.main .right{
  margin-left: 1rem;
  
}
.main .right .top{
  display: flex;
  margin-top: 1rem;
}
.title{
  margin-right: 5rem;
}
</style>